
// 导入 请求
import ajax from "../../../until/request.js"


// 导入封装的方法

import { getDoms } from '../../public/js/public.js'


class Login {
  constructor() {
    this.doms = getDoms({
      loginBtn: "#login",
      registerBtn: "#register",
      uname: "#username",
      password: "#password",
      alert_success: ".alert-success",
      alert_danger: ".alert-danger",
      check: "#rememberPwd",
    })
    console.log(this.doms)
    this.init()
  }
  // 初始化
  init () {
    this.login()
    this.register()
    this.togglePasswordVisibility()
  }

  // 登录
  login () {

    let userInfo = JSON.parse(localStorage.getItem("userInfo")) || {}

    // 判断 是否存入 密码 勾选记住密码  则打开页面渲染上去
    if (userInfo.username && userInfo.password) {
      this.doms.uname.value = userInfo.username
      this.doms.password.value = userInfo.password
    }
    // 点击登录按钮
    this.doms.loginBtn.addEventListener("click", (e) => {
      e.preventDefault()
      // 发送请求
      ajax.postPro({
        url: "http://localhost:8888/users/login",
        params: {
          username: this.doms.uname.value,
          password: this.doms.password.value,
        },
      }).then((result) => {
        //  请求成功  
        console.log(JSON.parse(result))
        if (JSON.parse(result).code === 1) {
          if (this.doms.check.checked) {
            // 如果选择 记住密码

            localStorage.setItem("user_id", JSON.parse(result).user.id)
            userInfo.username = this.doms.uname.value
            userInfo.password = this.doms.password.value
            userInfo.token = JSON.parse(result).token
            localStorage.setItem("userInfo", JSON.stringify(userInfo))

          } else {
            localStorage.setItem("user_id", JSON.parse(result).user.id)
            userInfo.username = this.doms.uname.value
            userInfo.password = ""
            userInfo.token = JSON.parse(result).token

            localStorage.setItem("userInfo", JSON.stringify(userInfo))
          }
          let i = 2
          this.doms.alert_success.style.display = "block"
          let timer = setInterval(() => {
            // 显示成功
            this.doms.alert_success.children[0].innerHTML = i
            if (i <= 0) {
              // 跳转
              clearInterval(timer)
              this.doms.alert_success.style.display = "none"
              location.href = "../index/index.html"
            }
            i--
          }, 1000)
        } else {
          this.doms.alert_danger.style.display = "block"
          let timeout = setTimeout(() => {
            clearTimeout(timeout)
            this.doms.alert_danger.style.display = "none"
          }, 1000)
          return
        }
      })
    })
  }


  togglePasswordVisibility () {

    let toggleIcon = document.querySelector('.toggle-icon')
    // console.log(toggleIcon)
    toggleIcon.addEventListener('click', () => {
      if (this.password.type === 'password') {
        this.password.type = 'text'
        toggleIcon.classList.remove("icon-kejian")
        toggleIcon.classList.add("icon-mimabukejian")
      } else {
        this.password.type = 'password'
        toggleIcon.classList.add("icon-kejian")
        toggleIcon.classList.remove("icon-mimabukejian")
      }


    })

  }

  register () {
    this.doms.registerBtn.addEventListener("click", (e) => {
      e.preventDefault()
      location.href = "../register/register.html"
    })
  }
}

let login = new Login()

export default login